import {toJS} from 'mobx';
import React from 'react';
import ReactDOM from 'react-dom';

import {Router, Route, useRouterHistory, IndexRedirect} from 'react-router';
import {createHashHistory} from 'History';
import {Provider} from 'mobx-react';
import {RouterStore, syncHistoryWithStore} from 'mobx-react-router';

const browserHistory = useRouterHistory(createHashHistory)({queryKey: '_key', basename: '/'});

const routingStore = new RouterStore();

const history = syncHistoryWithStore(browserHistory, routingStore);
window.weaHistory = history;

import CrmPortal from 'weaCrmPortal';
const CrmPortalStore = CrmPortal.store;
const CrmPortalRoute = CrmPortal.Route;

const stores = {
  routing: routingStore,
  ...CrmPortalStore
};

const routes = [
  CrmPortalRoute
]

const Home = props => props.children;

class Root extends React.Component {
  render() {
    return (
      <Provider {...stores}>
        <Router history={history}>
          <Route path='/' component={Home}>
            {routes}
          </Route>
        </Router>
      </Provider>
    );
  }
}

ReactDOM.render(
  <Root/>, document.getElementById('container')
);